import React from "react";
import '../Countdown.css';

const formatInt = (int) => {
    let str = String(int).padStart(2, '0')
    return str
}

const Digit = (props) => {
    const isLast = props.isLast
    const now = props.now
    // const {
    //     now,
    //     // limit,
    // } = props.digitData

    const colon = <span className="digit-colon">:</span>

    // const intArray = []
    // for (let i = 0; i < limit; i++) {
    //     intArray.push(i)
    // }
    //
    // const intTemplate = intArray.map(int => {
    //     const y = (now - int) * 32
    //     const transform = `translate(-50%, ${y - 16}px)`
    //     return <span key={int} style={{transform: transform,}}>
    //         {formatInt(int)}
    //     </span>
    // })


    return <div className="flex-center-align-center">
        <div className="digit-container" style={{...props.textContainerStyle,}}>
            {/*{intArray.length === 0*/}
            {/*    ? <span>{formatInt(now)}</span>*/}
            {/*    : intTemplate*/}
            {/*}*/}
            <span style={{...props.textStyle,}}>{formatInt(now)}</span>
        </div>
        {isLast ? null : colon}
    </div>
}

export default Digit